﻿<!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Checkout || Mozar</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        
		<!-- favicon
		============================================ -->		
        <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">
		
		<!-- Google Fonts
		============================================ -->		
        <link href='http://fonts.useso.com/css?family=Lato:400,400italic,900,700,700italic,300' rel='stylesheet' type='text/css'>
	   
		<!-- Bootstrap CSS
		============================================ -->		
        <link rel="stylesheet" href="css/bootstrap.min.css">
        
        <!-- nivo slider CSS
		============================================ -->
		<link rel="stylesheet" href="src/lib/nivo-slider/css/nivo-slider.css" type="text/css" />
		<link rel="stylesheet" href="src/lib/nivo-slider/css/preview.css" type="text/css" media="screen" />
        
		<!-- Fontawsome CSS
		============================================ -->
        <link rel="stylesheet" href="css/font-awesome.min.css">
        
		<!-- owl.carousel CSS
		============================================ -->
        <link rel="stylesheet" href="css/owl.carousel.css">
        
		<!-- jquery-ui CSS
		============================================ -->
        <link rel="stylesheet" href="css/jquery-ui.css">
        
		<!-- meanmenu CSS
		============================================ -->
        <link rel="stylesheet" href="css/meanmenu.min.css">
        
		<!-- animate CSS
		============================================ -->
        <link rel="stylesheet" href="css/animate.css">
        
		<!-- style CSS
		============================================ -->
        <link rel="stylesheet" href="style.css">
        
		<!-- responsive CSS
		============================================ -->
        <link rel="stylesheet" href="css/responsive.css">
        
		<!-- modernizr JS
		============================================ -->		
        <script src="js/vendor/modernizr-2.8.3.min.js"></script>
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
        
        <!--Header Start-->
        <header>
            <div class="header-top">
                <div class="container">
                    <div class="header-container">
                        <div class="row">
                            <div class="col-md-6 col-sm-7">
                                <div class="header-contact">
                                    <span class="email">Email: admin@bootexperts.com </span> / <span class="phone">Phone: +234.546.657</span>
                                </div>
                            </div>
                            <div class="col-md-6 col-sm-5">
                                <div class="currency-language">
                                    <div class="currency-menu">
                                        <ul>
                                            <li><a href="#">USD <i class="fa fa-angle-down"></i></a>
                                                <ul class="currency-dropdown">
                                                    <li><a href="#">EUR</a></li>
                                                    <li><a href="#">USD</a></li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="language-menu">
                                        <ul>
                                            <li><a href="#">English <i class="fa fa-angle-down"></i></a>
                                                <ul class="language-dropdown">
                                                    <li><a href="#">French</a></li>
                                                    <li><a href="#">English</a></li>
                                                    <li><a href="#">German</a></li>
                                                    <li><a href="#">Arabic</a></li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="account-menu">
                                        <ul>
                                            <li><a href="account.html">My Account <i class="fa fa-angle-down"></i></a>
                                                <ul class="account-dropdown">
                                                    <li><a href="wishlist.html">My Wishlist</a></li>
                                                    <li><a href="cart.html">My Cart</a></li>
                                                    <li><a href="checkout.html">Checkout</a></li>
                                                    <li><a href="blog.html">Blog</a></li>
                                                    <li><a href="account.html">Log In</a></li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>    
                </div>
            </div>
            <div class="header-main">
                <div class="container">
                    <div class="header-content">
                        <div class="row">
                            <div class="col-lg-3 col-md-3 col-sm-12">
                                <div class="logo">
                                    <a href="index.html"><img src="img//logo/logo.png" alt="MOZAR"></a>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-8">
                                <div id="search-category">
                                    <form class="search-box" action="#" method="post">
                                        <div class="search-categories">
                                            <div class="search-cat">
                                                <select class="category-items " name="category">
                                                    <option>All Categories</option>
                                                    <option>Women</option>
                                                    <option>Men</option>
                                                    <option>Jewllery</option>
                                                    <option>Bootees Bags</option>
                                                    <option>Clothing</option>
                                                    <option>Footwear</option>
                                                    <option>T-Shirts</option>
                                                </select>
                                            </div>
                                        </div>
                                        <input type="search" placeholder="Search here..." id="text-search" name="search">
                                        <button id="btn-search-category" type="submit">
                                            <i class="icon-search"></i>
                                        </button>
                                    </form>
                                </div>
                            </div>
                            <div class="col-lg-3 col-md-3 col-sm-4">
                                <ul class="header-r-cart">
                                    <li><a class="cart" href="cart.html">My Cart:2 items</a>
                                        <div class="mini-cart-content">
                                            <div class="cart-products-list">
                                                <div class="cart-products">
                                                    <div class="cart-image">
                                                        <a href="#"><img src="img/cart/1.jpg" alt=""></a>
                                                    </div>
                                                    <div class="cart-product-info">
                                                        <a href="#" class="product-name"> Donec ac tempus </a>
                                                        <a class="edit-product">Edit item</a>
                                                        <a class="remove-product">Remove item</a>
                                                        <div class="price-times">
                                                            <span class="quantity"><strong> 1 x</strong></span>
                                                            <span class="p-price">$100.00</span>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="cart-products">
                                                    <div class="cart-image">
                                                        <a href="#"><img src="img/cart/2.jpg" alt=""></a>
                                                    </div>
                                                    <div class="cart-product-info">
                                                        <a href="#" class="product-name">Quisque in arcu </a>
                                                        <a class="edit-product">Edit item</a>
                                                        <a class="remove-product">Remove item</a>
                                                        <div class="price-times">
                                                            <span class="quantity"><strong> 1 x</strong></span>
                                                            <span class="p-price">$260.00</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="cart-price-list">
                                                <p class="price-amount">SUBTotal : <span>$356.15</span> </p>
                                                <div class="cart-buttons">
                                                    <a href="checkout.html">Checkout</a>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>    
                </div>
            </div>
            <!--Mainmenu Start-->
            <div class="mainmenu-area hidden-sm hidden-xs">
                <div id="sticker"> 
                    <div class="container">
                        <div class="row">   
                            <div class="col-lg-12 col-md-12 hidden-sm">
                                <div class="mainmenu">
                                    <nav>
                                        <ul id="nav">
                                            <li class="current"><a href="index.html">Home</a>
                                                <ul class="sub-menu">
                                                    <li><a href="#" class="mega-title">Homepage</a></li>
                                                    <li><a href="index-2.html">Homepage Version 2</a></li>
                                                    <li><a href="index-3.html">Homepage Version 3</a></li>
                                                    <li><a href="index-4.html">Homepage Version 4</a></li>
                                                </ul>
                                            </li>
                                            <li><a href="shop-grid.html">Women</a>
                                                <div class="megamenu">
                                                    <div class="megamenu-list clearfix">
                                                        <span>											
                                                            <a href="#" class="mega-title">Clothing</a>
                                                            <a href="#">Blazers</a>
                                                            <a href="#">Jackets</a>
                                                            <a href="#">Collections</a>
                                                            <a href="#">T-Shirts</a>
                                                        </span>
                                                        <span>											
                                                            <a href="#" class="mega-title">Dresses</a>
                                                            <a href="#">Cocktail</a>
                                                            <a href="#">Sunglass</a>
                                                            <a href="#">Evening</a>
                                                            <a href="#">Footwear</a>
                                                        </span>
                                                        <span>											
                                                            <a href="#" class="mega-title">Handbags</a>
                                                            <a href="#">Bootees Bags</a>
                                                            <a href="#">Furniture</a>
                                                            <a href="#">Exclusive</a>
                                                            <a href="#">Jackets</a>
                                                        </span>
                                                        <span class="no-margin">										
                                                            <a href="#" class="mega-title">Jewellery</a>
                                                            <a href="#">Earrings</a>
                                                            <a href="#">Nosepins</a>
                                                            <a href="#">Braclets</a>
                                                            <a href="#">Bangels</a>
                                                        </span>
                                                        <span class="no-margin">										
                                                            <a href="#" class="mega-banner">
                                                                <img src="img/mega-banner.jpg" alt="">
                                                            </a>
                                                        </span>
                                                    </div>
                                                </div>
                                            </li>
                                            <li><a href="shop-grid.html">Men</a>
                                                <div class="megamenu">
                                                    <div class="megamenu-list clearfix">
                                                        <span>											
                                                            <a href="#" class="mega-title">Clothing</a>
                                                            <a href="#">Blazers</a>
                                                            <a href="#">Jackets</a>
                                                            <a href="#">Collections</a>
                                                            <a href="#">T-Shirts</a>
                                                        </span>
                                                        <span>											
                                                            <a href="#" class="mega-title">Dresses</a>
                                                            <a href="#">Cocktail</a>
                                                            <a href="#">Sunglass</a>
                                                            <a href="#">Evening</a>
                                                            <a href="#">Footwear</a>
                                                        </span>
                                                        <span>											
                                                            <a href="#" class="mega-title">Handbags</a>
                                                            <a href="#">Bootees Bags</a>
                                                            <a href="#">Furniture</a>
                                                            <a href="#">Exclusive</a>
                                                            <a href="#">Jackets</a>
                                                        </span>
                                                        <span class="no-margin">										
                                                            <a href="#" class="mega-title">Jewellery</a>
                                                            <a href="#">Earrings</a>
                                                            <a href="#">Nosepins</a>
                                                            <a href="#">Braclets</a>
                                                            <a href="#">Bangels</a>
                                                        </span>
                                                        <span class="no-margin">										
                                                            <a href="#" class="mega-banner">
                                                                <img src="img/mega-banner.jpg" alt="">
                                                            </a>
                                                        </span>
                                                    </div>
                                                </div>
                                            </li>
                                            <li><a href="shop-grid.html">Footwear</a></li>
                                            <li><a href="index.html">Pages</a>
                                                <ul class="sub-menu">
                                                    <li><a href="#" class="mega-title">Other Pages</a></li>
                                                    <li><a href="about.html">About Us</a></li>
                                                    <li><a href="blog.html">Blog Page</a></li>
                                                    <li><a href="blog-details.html">Blog Details Page</a></li>
                                                    <li><a href="account.html">My Account</a></li>
                                                    <li><a href="cart.html">Cart Page</a></li>
                                                    <li><a href="checkout.html">Checkout Page</a></li>
                                                    <li><a href="product-details.html">Product Details</a></li>
                                                    <li><a href="shop-grid.html">Shop Grid</a></li>
                                                    <li><a href="shop-list.html">Shop List</a></li>
                                                    <li><a href="wishlist.html">Wishlist</a></li>
                                                </ul>
                                            </li>
                                            <li><a href="contact.html">Contact Us</a></li>
                                        </ul>
                                    </nav>
                                </div>        
                            </div>
                        </div>
                    </div>
                </div>      
            </div>
            <!--End of Mainmenu-->
            <!-- Mobile Menu Area start -->
            <div class="mobile-menu-area">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <div class="mobile-menu">
                                <nav id="dropdown">
                                    <ul>
                                        <li><a href="index.html">HOME</a>
                                            <ul>
                                                <li><a href="index-2.html">Home 2</a></li>
                                                <li><a href="index-3.html">Home 3</a></li>
                                                <li><a href="index-4.html">Home 4</a></li>
                                            </ul>
                                        </li>
                                        <li><a href="#">SHOP</a>
                                            <ul>
                                                <li><a href="shop-grid.html">Shop Grid</a></li>
                                                <li><a href="shop-list.html">Shop List</a></li>
                                                <li><a href="product-details.html">Product Details</a></li>
                                            </ul>
                                        </li>
                                        <li><a href="blog.html">Blog</a>
                                            <ul>
                                                <li><a href="blog-details.html">Blog Details</a></li>
                                            </ul>
                                        </li>
                                        <li><a href="about.html">ABOUT</a>
                                        <li><a href="#">PAGES</a>
                                            <ul>
                                                <li><a href="account.html">My Account</a></li>
                                                <li><a href="cart.html">Cart</a></li>
                                                <li><a href="checkout.html">Checkout</a></li>
                                                <li><a href="wishlist.html">Wishlist</a></li>
                                            </ul>
                                        </li>
                                        <li><a href="contact.html">CONTACT</a></li>
                                    </ul>
                                </nav>
                            </div>					
                        </div>
                    </div>
                </div>
            </div>
            <!-- Mobile Menu Area end -->
        </header>    
        <!--End of Header Area-->
        <!--Checkout Area Start-->
        <div class="checkout-area area-padding">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <div class="page-title">
                            <h1>Checkout</h1>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-9 col-md-9">
                        <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                            <div class="panel panel-default">
                                <div class="panel-heading" role="tab" id="headingOne">
                                    <h4 class="panel-title">
                                        <a role="button" data-toggle="collapse" data-parent="#accordion" href="#checkout">
                                            <span>1</span>CHECKOUT METHOD
                                        </a>
                                    </h4>
                                </div>
                                <div id="checkout" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
                                    <div class="panel-body">
                                        <div class="row">   
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                                <div class="single-checkout">
                                                    <h3 class="login-title">Check as a guest or register</h3>
                                                    <p class="heading-p">Register with us for future convenience</p>
                                                    <form action="#">
                                                        <label>
                                                            <input type="radio" name="check" value="guest">
                                                            <span>Checkout as Guest</span>
                                                        </label>
                                                         <label>
                                                            <input type="radio" name="check" value="user" checked="checked">
                                                            <span>Register</span>
                                                        </label>
                                                    </form>
                                                </div>
                                                <div class="single-checkout">
                                                    <h4>Register and save time !</h4>
                                                    <p class="heading-p">Register with us for future convenience</p>
                                                    <p class="fast-check">Fast and easy checkout</p>
                                                    <p class="fast-check">Easy access  to your order history and status</p>
                                                    <a href="#" class="c-btn">Continue</a>
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                                <div class="single-checkout right">
                                                    <h3 class="login-title">Login</h3>
                                                    <h4>Already Registered?</h4>
                                                    <p>Please log in below :</p>
                                                    <div class="login-form">
                                                        <form action="#">
                                                            <p>Email Adress<span>*</span></p>
                                                            <input type="email" required>
                                                            <p>Password<span>*</span></p>
                                                            <input type="password" required>
                                                            <a href="help-center.html" class="forgot-pass">Forgot your Password ?</a>
                                                            <a href="#" class="login-btn">Login</a>
                                                        </form>
                                                    </div>
                                                </div>    
                                            </div>
                                        </div>    
                                    </div>
                                </div>
                            </div>
                            <div class="panel panel-default">
                                <div class="panel-heading" role="tab" id="headingTwo">
                                    <h4 class="panel-title">
                                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#billing">
                                            <span>2</span> BILLING INFORMATION
                                        </a>
                                    </h4>
                                </div>
                                <div id="billing" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                                    <div class="panel-body">
                                        <div class="login-form">
                                            <form action="#" method="post">
                                                <div class="customer-name">
                                                    <div class="first-name">
                                                        <p>First Name<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="last-name">
                                                        <p>Last Name<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                </div>
                                                <div class="customer-info">
                                                    <div class="company-name">
                                                        <p>Company</p>
                                                        <input type="text">
                                                    </div>
                                                    <div class="email-address">
                                                        <p>Email Adress<span>*</span></p>
                                                        <input type="email" required>
                                                    </div>
                                                </div>
                                                <p>Address<span>*</span></p>
                                                <input type="text" required>
                                                <input type="text">
                                                <div class="city-country">
                                                    <div class="city">
                                                        <p>City<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="state">
                                                        <p>State/Province</p>
                                                        <select class="country">
                                                            <option value="state">Please select region, state or province</option>
                                                            <option value="indo">Bahasa Indonesia</option>
                                                            <option value="melyu">Bahasa Melayu</option>		
                                                            <option value="deutsch">Deutsch (Deutschland)</option>		
                                                            <option value="austra">English (Australia)</option>		
                                                            <option value="canada">English (Canada)</option>		
                                                            <option value="india">English (India)</option>		
                                                            <option value="ireland">English (Ireland)</option>		
                                                            <option value="maktoob">English (Maktoob)</option>		
                                                            <option value="malaysia">English (Malaysia)</option>		
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="city-country">
                                                    <div class="city">
                                                        <p>Zip/Postal Code<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="state">
                                                        <p>Country<span>*</span></p>
                                                        <select class="country">
                                                            <option value="AF">Afghanistan</option>
                                                            <option value="AU">Australia</option>		
                                                            <option value="BH">Bahrain</option>		
                                                            <option value="BD">Bangladesh</option>		
                                                            <option value="CA">Canada</option>		
                                                            <option value="DK">Denmark</option>		
                                                            <option value="EG">Egypt</option>		
                                                            <option value="FR">France</option>		
                                                            <option value="GB">United Kingdom</option>		
                                                            <option selected="selected" value="US">United States</option>		
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="customer-info">
                                                    <div class="telephone">
                                                        <p>Telephone<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="fax">
                                                        <p>Fax</p>
                                                        <input type="text">
                                                    </div>
                                                </div>
                                                <div class="ship-wrap">
                                                    <div class="ship-address">
                                                        <label>
                                                            <input type="radio" name="shipping_address" value="old-address" checked="checked">Ship to this address
                                                        </label>    
                                                    </div>
                                                     <div  class="ship-address">
                                                       <label>
                                                            <input type="radio" name="shipping_address" value="new-address" id="ship-new-address">Ship to different address
                                                        </label>
                                                    </div>
                                                </div>
                                                <div class="ship-new-address-info">
                                                    <div class="customer-name">
                                                        <div class="first-name">
                                                            <p>First Name<span>*</span></p>
                                                            <input type="text" required>
                                                        </div>
                                                        <div class="last-name">
                                                            <p>Last Name<span>*</span></p>
                                                            <input type="text" required>
                                                        </div>
                                                    </div>
                                                    <div class="customer-info">
                                                        <div class="company-name">
                                                            <p>Company</p>
                                                            <input type="text">
                                                        </div>
                                                        <div class="email-address">
                                                            <p>Email Adress<span>*</span></p>
                                                            <input type="email" required>
                                                        </div>
                                                    </div>
                                                    <p>Address<span>*</span></p>
                                                    <input type="text" required>
                                                    <input type="text">
                                                    <div class="city-country">
                                                        <div class="city">
                                                            <p>City<span>*</span></p>
                                                            <input type="text" required>
                                                        </div>
                                                        <div class="state">
                                                            <p>State/Province</p>
                                                            <select class="country">
                                                                <option value="state">Please select region, state or province</option>
                                                                <option value="indo">Bahasa Indonesia</option>
                                                                <option value="melyu">Bahasa Melayu</option>		
                                                                <option value="deutsch">Deutsch (Deutschland)</option>		
                                                                <option value="austra">English (Australia)</option>		
                                                                <option value="canada">English (Canada)</option>		
                                                                <option value="india">English (India)</option>		
                                                                <option value="ireland">English (Ireland)</option>		
                                                                <option value="maktoob">English (Maktoob)</option>		
                                                                <option value="malaysia">English (Malaysia)</option>		
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="city-country">
                                                        <div class="city">
                                                            <p>Zip/Postal Code<span>*</span></p>
                                                            <input type="text" required>
                                                        </div>
                                                        <div class="state">
                                                            <p>Country<span>*</span></p>
                                                            <select class="country">
                                                                <option value="AF">Afghanistan</option>
                                                                <option value="AU">Australia</option>		
                                                                <option value="BH">Bahrain</option>		
                                                                <option value="BD">Bangladesh</option>		
                                                                <option value="CA">Canada</option>		
                                                                <option value="DK">Denmark</option>		
                                                                <option value="EG">Egypt</option>		
                                                                <option value="FR">France</option>		
                                                                <option value="GB">United Kingdom</option>		
                                                                <option selected="selected" value="US">United States</option>		
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="customer-info">
                                                        <div class="telephone">
                                                            <p>Telephone<span>*</span></p>
                                                            <input type="text" required>
                                                        </div>
                                                        <div class="fax">
                                                            <p>Fax</p>
                                                            <input type="text">
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="buttons-set">
                                                    <button class="button" type="button"><span>Continue</span></button>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="panel panel-default">
                                <div class="panel-heading" role="tab" id="headingThree">
                                    <h4 class="panel-title">
                                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#shipping">
                                            <span>3</span> SHIPPING INFORMATION
                                        </a>
                                    </h4>
                                </div>
                                <div id="shipping" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                                    <div class="panel-body">
                                        <div class="login-form">
                                            <form action="#" method="post">
                                                <div class="customer-name">
                                                    <div class="first-name">
                                                        <p>First Name<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="last-name">
                                                        <p>Last Name<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                </div>
                                                <div class="customer-info">
                                                    <div class="company-name">
                                                        <p>Company</p>
                                                        <input type="text">
                                                    </div>
                                                </div>
                                                <p>Address<span>*</span></p>
                                                <input type="text" required>
                                                <input type="text">
                                                <div class="city-country">
                                                    <div class="city">
                                                        <p>City<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="state">
                                                        <p>State/Province</p>
                                                        <select class="country">
                                                            <option value="state">Please select region, state or province</option>
                                                            <option value="indo">Bahasa Indonesia</option>
                                                            <option value="melyu">Bahasa Melayu</option>		
                                                            <option value="deutsch">Deutsch (Deutschland)</option>		
                                                            <option value="austra">English (Australia)</option>		
                                                            <option value="canada">English (Canada)</option>		
                                                            <option value="india">English (India)</option>		
                                                            <option value="ireland">English (Ireland)</option>		
                                                            <option value="maktoob">English (Maktoob)</option>		
                                                            <option value="malaysia">English (Malaysia)</option>		
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="city-country">
                                                    <div class="city">
                                                        <p>Zip/Postal Code<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="state">
                                                        <p>Country<span>*</span></p>
                                                        <select class="country">
                                                            <option value="AF">Afghanistan</option>
                                                            <option value="AU">Australia</option>		
                                                            <option value="BH">Bahrain</option>		
                                                            <option value="BD">Bangladesh</option>		
                                                            <option value="CA">Canada</option>		
                                                            <option value="DK">Denmark</option>		
                                                            <option value="EG">Egypt</option>		
                                                            <option value="FR">France</option>		
                                                            <option value="GB">United Kingdom</option>		
                                                            <option selected="selected" value="US">United States</option>		
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="customer-info">
                                                    <div class="telephone">
                                                        <p>Telephone<span>*</span></p>
                                                        <input type="text" required>
                                                    </div>
                                                    <div class="fax">
                                                        <p>Fax</p>
                                                        <input type="text">
                                                    </div>
                                                </div>
                                                <div class="billing-add">
                                                    <input type="checkbox" class="checkbox" value="1" name="billing_address">
                                                    <label>Use Billing Address</label>
                                               </div>
                                                <div class="buttons-set">
                                                    <p class="back-link"><a href="#">Back</a></p>
                                                    <button class="button" type="button"><span>Continue</span></button>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="panel panel-default">
                                <div class="panel-heading" role="tab" id="headingFour">
                                    <h4 class="panel-title">
                                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#shipping-method">
                                            <span>4</span> SHIPPING Method
                                        </a>
                                    </h4>
                                </div>
                                <div id="shipping-method" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                                    <div class="panel-body">
                                        <div class="ship-method">
                                            <p>Flat Rate</p>
                                            <p>Fixed <span>$10.00</span></p>
                                            <div class="buttons-set">
                                                <p class="back-link"><a href="#">Back</a></p>
                                                <button type="button" class="button"><span>Continue</span></button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="panel panel-default">
                                <div class="panel-heading" role="tab" id="headingFive">
                                    <h4 class="panel-title">
                                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#payment-info">
                                            <span>5</span> PAYMENT INFORMATION
                                        </a>
                                    </h4>
                                </div>
                                <div id="payment-info" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                                    <div class="panel-body">
                                        <div class="ship-method payment">
                                            <div class="ship-wrap">
                                                <div class="ship-address">
                                                    <input type="radio" name="check" value="check">
                                                    <span>Check / Money order </span>
                                                </div>
                                                 <div class="ship-address">
                                                    <input type="radio" name="check" value="credit">
                                                    <span>Credit Card (saved) </span>
                                                </div>
                                            </div>
                                            <div class="buttons-set">
                                                <p class="back-link"><a href="#">Back</a></p>
                                                <button type="button" class="button"><span>Continue</span></button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="panel panel-default">
                                <div class="panel-heading" role="tab" id="headingSix">
                                    <h4 class="panel-title">
                                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#order-review">
                                            <span>6</span> ORDER REVIEW
                                        </a>
                                    </h4>
                                </div>
                                <div id="order-review" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                                    <div class="panel-body">
                                        <form action="#">
                                            <div class="checkout-table table-responsive">
                                                <table>
                                                    <thead>
                                                        <tr>
                                                            <th class="p-name alignleft">Product Name</th>
                                                            <th class="p-amount">Price</th>
                                                            <th class="p-quantity">Qty</th>
                                                            <th class="p-total">SubTotal</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        <tr>
                                                            <td class="p-name">Aliquam consequat</td>
                                                            <td class="p-amount"><span class="amount">£156.87</span></td>
                                                            <td class="p-quantity">1</td>
                                                            <td class="p-total alignright">£156.87</td>
                                                        </tr>
                                                        <tr>
                                                            <td class="p-name">Spante Congue</td>
                                                            <td class="p-amount"><span class="amount">£156.87</span></td>
                                                            <td class="p-quantity">1</td>
                                                            <td class="p-total alignright">£156.87</td>
                                                        </tr>
                                                    </tbody>
                                                    <tfoot>
                                                        <tr>
                                                            <td colspan="3" class="alignright">Subtotal</td>
                                                            <td class="floatright">£313.84</td>
                                                        </tr>
                                                        <tr>
                                                            <td colspan="3" class="alignright">Shipping &amp; Handling (Flat Rate - Fixed)    </td>
                                                            <td class="floatright">£5.00</td>
                                                        </tr>
                                                        <tr>
                                                            <td colspan="3" class="alignright"><strong>Grand Total</strong></td>
                                                            <td class=" alignright"><strong>£318.84</strong></td>
                                                        </tr>
                                                    </tfoot>
                                                </table>
                                                <div class="checkout-buttons">
                                                    <p class="floatleft">Forgot an Item? <a href="#">Edit Your Cart</a>
</p>
                                                    <button type="button" class="button floatright"><span>Place Order</span></button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-3">
                        <div class="checkout-progress">
                            <div class="section-title"><h2>Checkout Progress</h2></div>
                            <ul class="check">
                                <li><a href="#"><i class="fa fa-angle-right"></i>Billing address</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>Shipping address</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>shipping method</a></li>
                                <li><a href="#"><i class="fa fa-angle-right"></i>payment method</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--End of Checkout Area-->      
        <!--Brand Area Strat-->
        <div class="brand-area">
            <div class="container">
                <div class="brand-content">
                    <div class="row">
                        <div class="brand-carousel">
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/1.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/2.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/3.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/4.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/5.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/6.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/1.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="single-brand">
                                    <a href="#">
                                        <img src="img/brand/6.jpg" alt="">
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>    
            </div>
        </div>
        <!--End of Brand Area-->
        <!--Service Area Start-->
        <div class="service-area">
            <div class="container">
                <div class="service-padding">
                    <div class="row">
                        <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                            <div class="single-service">
                                <span class="fa fa-truck"></span>
                                <h3>fREE SHIPPING</h3>
                                <p>One order over $99</p>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                            <div class="single-service">
                                <span class="fa fa-dropbox"></span>
                                <h3>Special gift cards</h3>
                                <p> Give the perfect gift</p>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                            <div class="single-service">
                                <span class="fa fa-calendar-o"></span>
                                <h3>Daily promotion</h3>
                                <p> Set up perspiciatis unde</p>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 hidden-sm col-xs-12">
                            <div class="single-service">
                                <span class="fa fa-comments-o"></span>
                                <h3>Special gift cards</h3>
                                <p> Give the perfect gift</p>
                            </div>
                        </div>
                    </div>
                </div>    
            </div>
        </div>
        <!--End of Service Area-->
        <!--Footer Widget Area Start-->
        <div class="footer-widget-area">
            <div class="container">
                <div class="footer-widget-padding"> 
                    <div class="row">
                        <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                            <div class="single-widget">
                                <div class="footer-widget-title">
                                    <h3>our support</h3>
                                </div>
                                <div class="footer-widget-list ">
                                    <ul>
                                        <li><a href="#">Sitemap</a></li>
                                        <li><a href="#">Privacy Policy</a></li>
                                        <li><a href="#">Your Account</a></li>
                                        <li><a href="#">Advanced Search</a></li>
                                        <li><a href="#">Contact Us</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 hidden-sm col-xs-12">
                            <div class="single-widget">
                                <div class="footer-widget-title">
                                    <h3>My account</h3>
                                </div>
                                <div class="footer-widget-list ">
                                    <ul>
                                        <li><a href="#">My Account</a></li>
                                        <li><a href="#">Order History</a></li>
                                        <li><a href="#">Returns</a></li>
                                        <li><a href="#">Specials</a></li>
                                        <li><a href="#">Site Map</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                            <div class="single-widget">
                                <div class="footer-widget-title">
                                    <h3>Contact us</h3>
                                </div>
                                <div class="footer-widget-list ">
                                    <ul class="address">
                                        <li><span class="fa fa-map-marker"></span> Addresss: Lorem ipsum dolor</li>
                                        <li><span class="fa fa-phone"></span> (800) 0123 4567 890</li>
                                        <li class="support-link"><span class="fa fa-envelope-o"></span> admin@bootexperts.com</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                            <div class="single-widget">
                                <div class="footer-widget-title">
                                    <h3>Sign up for newsletter</h3>
                                </div>
                                <div class="footer-widget-list ">
                                    <form id="newsletter" method="post" action="#">
                                        <div class="newsletter-content">
                                           <input type="text" name="email">
                                            <button class="button" type="submit"><span>Subscribe</span></button>
                                        </div>
                                    </form>
                                    <ul class="social-link">
                                        <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                                        <li><a href="#"><i class="fa fa-rss"></i></a></li>
                                        <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                                        <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
                                        <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>     
            </div>
        </div>
        <!--End of Footer Widget Area-->
        <!--Footer Area Start-->
        <footer class="footer">
            <div class="container">
                <div class="footer-padding">   
                    <div class="row">
                        <div class="col-lg-7 col-md-7 col-sm-8">
                            <nav>
                                <ul id="footer-menu">
                                    <li><a href="#">About Us</a></li>
                                    <li><a href="#">Contact Us</a></li>
                                    <li><a href="#">Customer Service</a></li>
                                    <li><a href="#">Privacy Policy</a></li>
                                </ul>
                                <p class="author">Copyright © 2016 <a href="#">BootExperts</a> All Rights Reserved.</p>
                            </nav>
                        </div>
                        <div class="col-lg-5 col-md-5 col-sm-4">
                            <p class="payment-image">
                                <img src="img/payment.png" alt="">
                            </p>
                        </div>
                    </div>
                </div>    
            </div>
        </footer>
        <!--End of Footer Area-->
        
		<!-- jquery
		============================================ -->		
        <script src="js/vendor/jquery-1.11.3.min.js"></script>
        
		<!-- bootstrap JS
		============================================ -->		
        <script src="js/bootstrap.min.js"></script>
        
        <!-- nivo slider js
		============================================ -->       
		<script src="src/lib/nivo-slider/js/jquery.nivo.slider.js" type="text/javascript"></script>
		<script src="src/lib/nivo-slider/home.js" type="text/javascript"></script>
		
		<!-- wow JS
		============================================ -->		
        <script src="js/wow.min.js"></script>
        	
		<!-- meanmenu JS
		============================================ -->		
        <script src="js/jquery.meanmenu.js"></script>
        
		<!-- owl.carousel JS
		============================================ -->		
        <script src="js/owl.carousel.min.js"></script>
        
		<!-- price-slider JS
		============================================ -->		
        <script src="js/jquery-price-slider.js"></script>	
        
		<!-- scrollUp JS
		============================================ -->		
        <script src="js/jquery.scrollUp.min.js"></script>
        
        <!--Countdown js-->
        <script src="js/jquery.countdown.min.js"></script>
        
		<!-- Sticky Menu JS
		============================================ -->		
        <script src="js/jquery.sticky.js"></script>
        
		<!-- Elevatezoom JS
		============================================ -->		
        <script src="js/jquery.elevateZoom-3.0.8.min.js"></script>
        
		<!-- plugins JS
		============================================ -->		
        <script src="js/plugins.js"></script>
        
		<!-- main JS
		============================================ -->		
        <script src="js/main.js"></script>
    </body>
</html>